<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<link rel="stylesheet" type="text/css" href="$!{basePath}/content/system/h5/css/mobile-ui1.0-compress.css" />
		<link rel="stylesheet" href="//g.alicdn.com/msui/sm/0.6.2/css/sm.min.css">
		<link rel="stylesheet" href="//g.alicdn.com/msui/sm/0.6.2/css/sm-extend.min.css">
		<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
		<script type="text/javascript" src="$!{basePath}/content/system/h5/js/mobile-ui1.0-compress.js"></script>
		<title></title>
		<style type="text/css">
			.list-block{
				margin: 0 !important;
			}
			[v-cloak] {
			    display: none !important;
			
			}
		</style>
	</head>
	<body>
		<div class="bindform">
			<div class="content">
				<div class="list-block">
					<ul>
						<li>
							<div class="item-content">
								<div class="item-media"><i class="icon icon-form-name"></i></div>
								<div class="item-inner">
									<div class="item-title label">提示</div>
									<span style="font-size: 14px;">该页面请在要绑定的微信中打开</span>
								</div>
							</div>
						</li>
						<li>
							<div class="item-content">
								<div class="item-media"><i class="icon icon-form-password"></i></div>
								<div class="item-inner">
									<div class="item-title label">用户名</div>
									<div class="item-input" v-cloak>
										<span>$!{username}</span>
									</div>
								</div>
							</div>
						</li>
						<li>
							<div class="item-content">
								<div class="item-media"><i class="icon icon-form-password"></i></div>
								<div class="item-inner">
									<div class="item-title label">微信号</div>
									<div class="item-input">
										<input type="password" v-model="wxNo" placeholder="请输入微信号">
									</div>
								</div>
							</div>
						</li>
						<li>
							<div class="row">
								<div class="col-100"><a href="#" @click="sub" class="button button-big button-fill button-success">确认绑定</a></div>
							</div>
						</li>
					</ul>
				</div>
			</div>
		</div>
	</body>
</html>
<script type="text/javascript">
	var uid = "$!{uid}";
	var username = "$!{username}";
	var app = new Vue({
		el: ".bindform",
		data: {
			wxNo: "",
			userName: ""
		},
		mounted() {
			var url = location.search; 
			this.userName=decodeURI(decodeURI(url.substring(url.indexOf("=")+1)))
			
		},
		methods: {
			sub() {
				if (this.wxNo == "") {
					MobileUi.init({
						type: 4,
						title: '提示',
						text: '微信号不能为空',
					})
				} else {
					var start = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx06f77f0f29884605&redirect_uri="
					var end = "&response_type=code&scope=snsapi_userinfo&state=/abc";
					var authUrl = `http://${document.domain}/system/back/wx/getCode.do?uid=${uid}&wxId=${this.wxNo}`;
					authUrl = encodeURI(authUrl);
					window.location.href = start + authUrl + end;
				}
			}
		}
	})
</script>
